本文同步發布於個人部落格

網路知識是前後端入門必學的一個章節，有時面試也會考。
畢竟網頁開發者的作品 - 網頁，就是這樣活在網路世界裡的。
即使不是工程師，稍微熟悉一些電腦設定的，日常也多少會聽到 IP address、HTTPS 之類的字眼，甚至有些人其實就會自己設定電腦的網路配置。
前一陣子 (還是最近依舊還是？)，steam 的玩家發現 steam 商店載入很慢，這其實是台灣電信的 DNS 連線品質極低造成的，有一個解法就是把自己電腦 IpV4 的 DNS 改成 Google Public DNS (8.8.8.8 or 8.8.4.4)，這樣就能順利讓 steam 商店載入變快，大家又可以繼續玩買遊戲的遊戲了 XD。
好，這裡又出現了一個名詞，DNS，所以網路的世界到底怎麼運作？這些名詞究竟在這當中扮演什麼角色？

網路是一張巨大的交通網

在這裡先說明一個名詞 - 主機 (Host)。
主機指的是任何連上網路的裝置，像是你的電腦、手機、伺服器、路由器等，所以它是整個網路交通網的最小單位。
每一個主機都可以想像成一棟房子，所以世界上數以萬計的主機 (房子) 透過網路串聯彼此，形成一張龐大的交通網。

接下來試想一個情境：今天我在自己的電腦 (主機 A) 需要查找 JeremyHo 網站的內容 (主機 B)，我會需要在這龐大的交通網中找到主機 B 的位置對吧？該怎麼做？
我們不妨想像一下，有天要去台灣最高學府臺灣大學來個知識巡禮，但不知道他的地址，但大可以在導航裡透過搜尋這個「臺灣大學」來讓導航把你帶到學校去對吧？
網路的世界大概也是這樣一個道理，我們的主機需要一個地址，但地址通常很難記，所以我們通常會有一個「別名」來幫助記憶，就像你一般不會跟導航說去「大安區羅斯福路四段 1 號」，而是會說導航去「臺灣大學」是一樣的道理。
所以這裡我們知道以上情境有三個 point: 地址、別名，以及導航。
在網路世界裡一樣有這三個東西：

1. IP Address: 就是主機的地址，每一個主機都有一個獨一無二的 IP Address，像是前面提到的 Google Public DNS server 的 IP Address 就是 8.8.8.8 or 8.8.4.4。
2. Domain Name: 就是主機的別名，也是我們常見的網址，像是我自己網站的 https://jeremyho.tw。
3. DNS (Domain Name System): 就是導航，自己其實也是一台主機，但是是負責把 Domain Name 轉換成 IP Address 做查找的主機。

所以一般我們在瀏覽器輸入一個網址，或你在 Google 頁面點進去一個網站時，其實在那短短時間內，你的電腦和網路世界進行下面的交流 (我們假設就是要到 https://jeremyho.tw)：

1. 你的主機瀏覽器會先檢查自己的快取 (Cache)，看有沒有 jeremyho.tw 的 IP Address 紀錄，如果有就直接用這個 IP Address 去找主機 B。
2. 假設沒有 cache 紀錄，你是第一次要找這個網站，那你的主機就會去找 DNS 伺服器 (通常是你的 ISP，也就是網路服務提供商提供的 DNS server)，詢問 jeremyho.tw 的 IP Address 是多少。
3. DNS 伺服器收到請求後，會去查找 jeremyho.tw 的 IP Address，找到後回傳給你的主機。
4. 你的主機拿到 IP Address 後，就會直接向這個 IP Address 發送 HTTP/HTTPS 請求，請求網站內容。

HTTPS vs HTTP

在前一段的尾聲，提到了 HTTP/HTTPS 請求，這兩個又是另一件事了。
我們試著設想，你今天是帶著一份攸關世界醫學發展的重大機密文件要到台大醫院，你會選擇怎麼前往？

1. 選擇搭捷運。
2. 選擇聘保鑣搭乘專車。

顯然第二個選項會比較安全嘛，對吧？
這其實就是 HTTP 和 HTTPS 的差別。

HTTP (HyperText Transfer Protocol) 是一種不加密的通訊協定，當你透過 HTTP 傳輸資料時，資料是以明文形式傳送的，這意味著任何在傳輸路徑上的人都可以輕易地攔截並閱讀這些資料。
而 HTTPS (HyperText Transfer Protocol Secure) 則是在 HTTP 的基礎上加入了 SSL/TLS 加密層，這樣資料在傳輸過程中會被加密，即使被攔截，攻擊者也無法輕易解讀內容。
所以在推廣網路安全知識時，通常都會建議大家盡量使用 HTTPS 網站，尤其是當你需要傳輸敏感資訊 (如帳號密碼、信用卡資料等) 時。
很多人會說，幹嘛裝防毒軟體，培養好的網路使用習慣才是真的。
這個良好的習慣之一就是只去 HTTPS 網站。

CDN

最後提一嘴 CDN (Content Delivery Network)。
CDN 是一種分散式的伺服器網路，目的是將網站內容更快速且可靠地傳送給使用者。
我們試著想一下喔，已我的網站 jeremyho.tw 為例，我是部署在 vercel 的 server 上的，而 vercel 的 origin server 是在美國，所以每次進我的網站都要跟美國的伺服器做一次聯繫？那我的網站大概廢了。
CDN 就是這時派上用場的。

在全球各地設置多個節點伺服器，這些節點伺服器會緩存 (Cache) 網站的靜態資源 (如圖片、CSS、JavaScript 等)，當使用者訪問網站時，CDN 會根據使用者的地理位置，將請求導向距離最近的節點伺服器，這樣可以大幅減少延遲，提高載入速度。
所以白話一點講，CDN 就是一個中繼站，幫助你更快拿到你要的東西。
想像一下，你想買牛奶，不會去全聯的總部買，而是去你家附近的全聯買，這樣才快嘛，CDN 就是這個概念。

但 CDN 有個問題是，它只適合用來快取靜態資源，像是圖片、CSS、JavaScript 等，因為這些東西不會常常變動，可以被緩存。
如果網站的資訊是要依靠 api 回傳的動態資料 (像是使用者專屬的資訊)，那 CDN 就沒辦法幫上忙了，因為這些資料是即時產生的，無法被緩存。

一些 murmur

在前面提到 XSS 那篇，曾經稍微提到過前端能做的資安防護其實不多，XSS 基本是最主要的網頁攻擊手法。
那其他資安發生在哪裡？
其實一大部分就是網路通訊階段的各個流程中。
而這環節是前端比較難涉入的，一般公司也都會有專門的部門來處理這些事。
但網路知識還是很重要，至少身為一個前端 (or 後端)，你要稍微知道自己的產品會如何活在這個世界上。

最後說一下那些有名的發生在通訊階段的攻擊手法有哪些。

然後再提一嘴。
一些工程師會告訴你不要連 public wifi，因為不安全，這是有依據的。
網路真的沒你想像中安全，攻擊者其實只要跟你連結同一個 wifi，就有機會攔截你的通訊，包括你 POST 的資料、GET 拿到的東西，不知不覺你輸入的帳密等個人資訊可能就這樣被偷偷拿走了。
所以這也是為什麼網路那麼多賣 VPN 的廣告，因為多一層 VPN 加密，的確能一定程度多上一層保障 (但我沒叫你一定要買 VPN 喔，我就沒買，養成良好的網路使用習慣才是真的)。
然後這類攻擊其實比你想像得更容易發生，有個軟體叫 Wireshark，就可以讓人輕易嗅探未加密得 wifi 環境裡的封包，而這個軟體是誰都可以載的。
不過如果網站有導入 HTTPS，就算在公共 Wi-Fi 上也能避免大多數嗅探，攻擊者抓到的也只是加密後的封包。
所以要養成良好的網路使用習慣，比如只去 HTTPS 網站、避免在公共 wifi 上輸入敏感資訊，就能大幅降低風險。